<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/view/include/css-include.jsp"%>
<%@ include file="/view/include/jsp-include.jsp"%>
<%@ include file="/view/include/jquery-include.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>TMI</title>

<script type="text/javascript">
<%--============================= 전역변수 선언 ==========================--%>

    <%--============================= window onload ==========================--%>

    $().ready(function() {

        <%-- 달력 --%>
        calendar.makeCalender("localDate");
        
        if($("#roleId").val() == "3"){
        	$("#orderNumPop").attr("style", "display:none");
            $("#bo_btn").attr("style", "display:none");
        }
        
        var keyparam = '${ordPseq}';
        var keyparam2 = '${ordNo1}';
        var keyparam3 = '${ordNo2}';
        var keyparam4 = '${clearNo}';
        var keyparam5 = '${mawb}';
        var keyparam6 = '${hawb}';
        if(keyparam != null && keyparam != ""){
            view(keyparam2+'-'+keyparam, keyparam2, keyparam3, keyparam, keyparam5, keyparam6, keyparam4);
        }
        
        $("span[id='confirmBtn']").hide();
        
        /* textarea 체크 */
        $("#remark").bind("keyup",function(){
            textAreaKyUp(this);  //조회 직후에도 호출해야해서 function 으로 뺌.. 
        });
        
        /* 오더 조회 팝업 버튼 */
        $("#searchBtn").bind("click",function(){
            orderNumPopCall();
        });
        
        $("#reSetBtn").bind("click",function(){
            reSetFrm();
        });
        
        //삭제
        $("#deleteBtn").bind("click",function(){
            doDelete();
        });
        
        /* 저장버튼 */
        $("#saveBtn").bind("click",function(){       
            $("form[name='movementFrm']").submit();
        });
       

        /* 확정버튼 */
        $("#confirmBtn").bind("click",function(){       
            confirmMovement();
        });
        
        
        /* 메인폼 서브밋 */
        $("form[name='movementFrm']").ajaxForm({
            dataType: "json",
            beforeSerialize: function($form, options) {
                //return $("form[name='movementFrm']").valid();  jquery 벨류데이션 플러그인 사용시
                if( $("#mawb").val() == null || $("#mawb").val() == "" ){
                	alert("SEARCH!!");
                    // alert("조회 후 입력 해주세요.");
                    return false;
                }
                
                 if( !validation() ){       //화면 항목 점검 시작
                    return false;
                }
                 if(!confirm("Save?")){
                    return false;
                 }
            },
            success:function(data) {
               if(data.result == true){
                   if($("#completeYn").val() == "N" ){
                        alert("Please, Check Your Confirm!!");
                   }
                   
                   alert("Complete the save");
                   searchDataMaping(data);   //조회 데이터 맵핑 펑션
               }               
           },
           error:function(){alert("error!!");}
        }); 
        
    });
    
    <%--============================= function ==========================--%>
    
    function confirmMovement(){
        if( $("#mawb").val() == null || $("#mawb").val() == "" ){
            alert("SEARCH!!!");
            return false;
        }
        
        if(confirm("Confirmation?")){
            $.post("/confirmMovement.json",{
            	clearNo          : $("#clearNo").val()
            },function(data){
                if(data.result == true){
                    alert("Confirmation.");
                    view($("#ordNum").val() , $("#ordNo1").val() , $("#ordNo2").val() ,$("#ordPseq").val() ,$("#mawb").val(), $("#hawb").val() , $("#clearNo").val() );            
                }
            });
        }
    };

        
    /* 조회 펑션 */
    function view(ordNum, ordNo1, ordNo2, ordPseq, mawb, hawb, clearNo){
        $("#ordNum").val(ordNum);
        $("#ordNo1").val(ordNo1);
        $("#ordNo2").val(ordNo2);
        $("#ordPseq").val(ordPseq);
        $("#mawb").val(mawb);
        $("#hawb").val(hawb);
        $("#clearNo").val(clearNo);

        $.post(
               '/getMovementView.json', {
                ordNo1 : ordNo1,
                ordNo2 : ordNo2,
                ordPseq : ordPseq,
                mawb : mawb,
                hawb : hawb,
                clearNo : clearNo
               },
           function(data) {

               $("#saveStatus").val("UPDATE"); // 상태값 변경
                    
               searchDataMaping(data);    //DATA맵핑 
           });
        
    }
    
    
    
    /* searchData 맵핑 */
    function searchDataMaping(data){
        var val = ""; 
        for(var v in data.resultMap) {       //상단 조회 결과 맵핑 조회return값이 한건임
            $("#"+v).val(data.resultMap[v]);
        }
 
        if($("#delCnt").val() > 0 && $("#localDate").val() != ""){
            $("span[id='delBtn']").hide();
        }else{
            $("span[id='delBtn']").show();
        }
        
        //하단 그리드 맵핑
        var contents = "";
        $.each(data.resultDetailList, function(index){  // List로 받아온값 (여러건)
            
            //(Detail 테이블에 조회결과 입히기 jquery말고 그냥 onclick 걸어줌.. (조회 후 del 번튼에 key값 param변수로 입력)
            var rowNum = index+1;
            
            contents += "<tr id='dynamicDetailSearchRow"+rowNum+"'>"
                +'<td align="center" width="5%">'+rowNum+'<input type="hidden" name="ordSeq" id="ordSeq" value="'+this.ordSeq+'">'
                +'<input type="hidden" name="clearSeq" id="clearSeq" value="'+this.clearSeq+'">'
                +'<td align="center"  width="10%">'+this.batchNo+'</td>'
                +'<td align="center"  width="7%">'+this.goodsCode+'</td>'
                +'<td align="left"   width="43%">'+this.goodsName+'</td>';
/* 
                if(this.receiverName == ""){

                    contents += '<td align="center" width="10%"><input type="text" class="inST100"  maxlength="20" name="receiverName" id="receiverName" /></td>';                      
                }else{

                    contents += '<td align="center"  width="10%">'+this.receiverName+'</td>';
                }
 */
                contents += '<td align="right" width="10%">'+this.qty+'</td>'
                          +'<td align="center"  width="10%"">'+this.unit+'</td>';
/*                           
                 if($("#delCnt").val() > 0 && $("#localDate").val() != ""){
                	 contents += '<td align="center"  width="10%">'+this.temperature+'</td>';
                 }else{
                	 contents += '<td align="center"  width="10%"><input type="text" class="inST100" name="temperature" value="'+this.temperature+'"/></td>';
                 } */
/*                 if(this.receiverName == "" || $("#delCnt").val() > 0 ){

                    contents += '<td align="center"  width="5%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>';
                }else{
                    contents += '<td align="center"  width="5%"><img src="images/web/ic_up.gif" alt="Upate" align="center" id="onUpate" onclick="viewDialogOpen('+this.ordSeq+' , \''+this.clearSeq+'\',\''+this.receiverName+'\')" > </td>';
                }
                 */
                contents +='</tr>';
        });

        $("table[id='movementDetailTable']").empty().append(contents);  // 조회 값 뿌리기

        if( $("#completeYn").val() == "N" && $("#localDate").val() !="" ){
            $("span[id='confirmBtn']").show();
        }else{
            $("span[id='confirmBtn']").hide();
            
        }
                
        //$("#saveStatus").val("UPDATE"); // 상태값 변경
        
    }
    
    <%--================================= FORM 컨트롤 ============================--%>

    /* 삭제 펑션 */
    function doDelete(){
        if( $("#ordNo1").val() == "" || $("#ordNo2").val() == "" || $("#ordPseq").val() == "" ){
            alert("search plz.");
            return;
        }
        
        if(confirm("DELETE?")){
            $.post(
                    '/deleteDoMovement.json', {
                    ordNo1  : $("#ordNo1").val(),
                    ordNo2  : $("#ordNo2").val(),
                    ordPseq : $("#ordPseq").val(),
                    mawb    : $("#mawb").val(),
                    hawb    : $("#hawb").val(),
                    clearNo : $("#clearNo").val()
                    },
                function(data) {
                        if(data.result == true){
                            alert("OK!!");
                            reSetFrm();    //DATA맵핑 
                            $("span[id='delBtn']").show();
                        }else{
                            alert("error");
                        }
                });
        }
    }
    
    
    /* 초기화 펑션 */
    function reSetFrm(){
            $("form[name='movementFrm']").each(function(){
                this.reset();
          });
          $("span[id='delBtn']").show();
          $("#saveStatus").val("SAVE");     //신규 입력 상태로 변경
          $("table[id='movementDetailTable']").empty();
    }
    
    function validation(){
 
        var localDate        = $("#localDate").val();
        var vehicleNo        = $("#vehicleNo").val();
        
        if(localDate==null           || localDate=="") {   alert("Local Delivery Date: Required fields."); $("#localDate").focus(); return false; }
        if(vehicleNo==null           || vehicleNo=="") {   alert("Vehicle NO: Required fields."); $("#vehicleNo").focus(); return false; }

        
        //if(ordNo1.length < 5) {   alert("order No: Enter the 5 characters"); $("#ordNo1").focus(); return false; }
        
        if( !isValidDate(localDate,"Local Delivery Date") ){ $("#localDate").focus(); return false; }

/*      var ordDate         = $("#ordDate").val();
        var originCode      = $("#originCode").val();
        var originName      = $("#originName").val();
        var packingDesc     = $("#packingDesc").val();
        var reqDate         = $("#reqDate").val();
        var priceBase       = $("#priceBase").val();
        var scheduleDate    = $("#scheduleDate").val();
        var portOfLoadName  = $("#portOfLoadName").val();
        var transMethodName = $("#transMethodName").val();
 */
        
        
/*      if(ordDate==null         || ordDate=="") { alert("ordDate 입려하시오."); $("#ordDate").focus(); return false; }
        if(originCode==null      || originCode=="") { alert("originCode 입려하시오."); $("#originCode").focus(); return false; }
        if(originName==null      || originName=="") { alert("originName 입려하시오."); $("#originName").focus(); return false; }
        if(packingDesc==null     || packingDesc=="") { alert("packingDesc 입려하시오."); $("#packingDesc").focus(); return false; }
        if(reqDate==null         || reqDate=="") { alert("reqDate 입려하시오."); $("#reqDate").focus(); return false; }
        if(priceBase==null       || priceBase=="") { alert("priceBase 입려하시오."); $("#priceBase").focus(); return false; }
        if(scheduleDate==null    || scheduleDate=="") { alert("scheduleDate 입려하시오."); $("#scheduleDate").focus(); return false; }
        if(portOfLoadName==null  || portOfLoadName=="") { alert("portOfLoadName 입려하시오."); $("#portOfLoadName").focus(); return false; }
        if(transMethodName==null || transMethodName=="") { alert("transMethodName 입려하시오."); $("#transMethodName").focus(); return false; }

        if( !isValidDate(ordDate,"ordDate") ){ $("#ordDate").focus(); return false; }
        if( !isValidDate(reqDate,"reqDate") ){ $("#reqDate").focus(); return false; }
        if( !isValidDate(scheduleDate,"scheduleDate") ){ $("#scheduleDate").focus(); return false; }
        
 */     

          for(var i=0 ; i < $("[name=temperature]").length ; i++){
            var temperatureTmp = $("[name=temperature]").eq(i).val();
            if(temperatureTmp == null   || temperatureTmp == "") { alert("Temperature: Required fields."); $("[name=temperature]").eq(i).focus(); return false; }
        }
      
      return true;      
    } 
    
    /************************************************************************/
    /*                          view POPUP , 리턴값처리                     */
    /************************************************************************/
    function viewDialogOpen(ordSeq, clearSeq, receiverName){
        $("#pop_ordSeq").val(ordSeq);
        $("#pop_clearSeq").val(clearSeq);
        $("#pop_receiverName").val(receiverName);
        
        $("#viewDialog").dialog({
            modal:true, 
            width:300,
            title:"Detail Update"
        });
    }


    /* detail update*/
    function detailUpdate(){

        /* if(confirm("Update?")){ */
            $.post("/movementDetailUpdate.json",{
                ordNo1          : $("#ordNo1").val(),
                ordNo2          : $("#ordNo2").val(),
                ordPseq         : $("#ordPseq").val(),
                mawb            : $("#mawb").val(),
                hawb            : $("#hawb").val(),
                clearNo          : $("#clearNo").val(),
                ordSeq          : $("#pop_ordSeq").val(),
                clearSeq        : $("#pop_clearSeq").val(),
                receiverName    : $("#pop_receiverName").val()
            },function(data){
                if(data.result == true){
                    $("#viewDialog").dialog("close");
                    view($("#ordNum").val() , $("#ordNo1").val() , $("#ordNo2").val() ,$("#ordPseq").val() ,$("#mawb").val(), $("#hawb").val(), $("#clearNo").val());
                }
            });
        /* } */
    }

    /* 검색 팝업 버튼 */
    function orderNumPopCall(){
        window.open('/mawbHawbNumPop.html?menuType=MOVEMENT', 'mawbHawbNumPop', 'width=520, height=520, toolbar=no, location=no, status=no, menubar=no, scrollbars=no');
    };
       
    function detailClose(){
        $("#viewDialog").dialog("close");
        view($("#ordNum").val() , $("#ordNo1").val() , $("#ordNo2").val() ,$("#ordPseq").val() ,$("#mawb").val(), $("#hawb").val(), $("#clearNo").val());
    };
</script>
</head>


<body>
<div class="wrap">
    <div class="pagetitle">
        <h1>STOCK MOVEMENT TO W/H</h1>
    </div>
    <div class="">
    <!-- 레이어 팝업시작 -->
        <div id="viewDialog" style="display: none; background: white;">
         <input type="hidden" id="pop_ordSeq">
         <input type="hidden" id="pop_clearSeq">
           <table class="TableST">
             <tr>
               <th>Receiver</th>
               <td><input type="text" name="pop_receiverName" id="pop_receiverName" maxlength="20" class="inST50" maxlength="20"/></td>
              </tr>
             <tr>
              </tr>
           </table>
            <div class="bo_btn">
                <ul class="btnst"><li class="a"><a href="javascript: detailUpdate();" id="save" >Save</a></li></ul>
                <ul class="btnst"><li class="a"><a href='javascript:detailClose();' >CLOSE</a></li></ul>
            </div>    
       </div>
    <!-- 레이어 팝업끝 -->   
       
       
    <input type="hidden" id ="delCnt" name="delCnt"/>   
    <form name="movementFrm" method="post" action="/saveMovement.json"> <%--리턴값 json으로 설정 --%>
    <input type="hidden" id ="saveStatus" name="saveStatus" value="SAVE" />     <%-- 조회, 수정, 초기화, 최초 입력 시 필요 (최초, 초기화 후 = SAVE   ,  수정, 조회 후 = UPDATE)--%>
    <input type="hidden" id ="ordNo1" name="ordNo1"/>
    <input type="hidden" id ="ordNo2" name="ordNo2"/>
    <input type="hidden" id ="ordPseq" name="ordPseq"/>
    <input type="hidden" id ="clearNo" name="clearNo"/>
    <input type="hidden" id ="completeYn" name="completeYn"/>
        <table class="TableST">
<!--             <tr>
                <th>Order No</th>
                <td colspan="3">
                    <input type="text" class="inSTR30" id="ordNum" name="ordNum" readonly onFocus="blur();" value=""/></td>
            </tr> -->
            <tr>
                <th>MAWB</th>
                <td><input type="text" class="inSTR90" id="mawb" name="mawb" readonly onFocus="blur();" value="">
                    <img alt="Search" height="16" id="orderNumPop" onclick="orderNumPopCall();" src='/images/web/bkn_zoom.gif' align='absmiddle'>
                </td>
                <th class="thST2">HAWB</th>
                <td>
                    <input type="text" class="inSTR90" id="hawb" name="hawb" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th >Shipper</th>
                <td colspan="2">
                    <input type="text" class="inSTR10" id="sCustCode" name="sCustCode" readonly onFocus="blur();" value=""/>
                    <input type="text" class="inSTR80" style="width:85%;" id="sCustName" name="sCustName" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90" id="sAddr1" name="sAddr1" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr>
                <th> </th>
                <td><input type="text" class="inSTR100"id="sTel" name="sTel" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90" id="sFax" name="sFax" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90" id="sAddr2" name="sAddr2" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr>
                <th >Messrs</th>
                <td colspan="2">
                    <input type="text" class="inSTR10" id="mCustCode" name="mCustCode" readonly onFocus="blur();" value=""/>
                    <input type="text" class="inSTR80" style="width:85%;" id="mCustName" name="mCustName" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90" id="mAddr1" name="mAddr1" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr>
                <th></th>
                <td><input type="text" class="inSTR100" id="mTel" name="mTel" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90"  id="mFax" name="mFax" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90"  id="mAddr2" name="mAddr2" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr>
                <th >Notify Party</th>
                <td colspan="2">
                    <input type="text" class="inSTR10" id="nCustCode" name="nCustCode" readonly onFocus="blur();" value=""/>
                    <input type="text" class="inSTR80" style="width:85%;" id="nCustName" name="nCustName" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90" id="nAddr1" name="nAddr1" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr>
                <th></th>
                <td><input type="text" class="inSTR100" id="nTel" name="nTel" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90"  id="nFax" name="nFax" readonly onFocus="blur();" value=""/></td>
                <td><input type="text" class="inSTR90"  id="nAddr2" name="nAddr2" readonly onFocus="blur();" value=""/></td>
            </tr>
            <tr> 
                <th>Packing</th>
                <td colspan="3">
                    <input type="text" class="inSTR90" style="width:96%;" id="packing" name="packing" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Stored at</th>
                <td colspan="3">
                    <input type="text" class="inSTR90" style="width:96%;" id="storedAt" name="storedAt" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Loding</th>
                <td><input type="text" class="inSTR90" id="loading" name="loading" readonly onFocus="blur();" value=""></td>
                <th class="thST2">Destination</th>
                <td>
                    <input type="text" class="inSTR90" id="destination" name="destination" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Sailing on</th>
                <td>
                    <input type="text" class="inSTR90" id="sailingOn" name="sailingOn" readonly onFocus="blur();" value=""/>
                </td>
                <th class="thST2">Net-Weight</th>
                <td>
                    <input type="text" class="inSTR90" id="net" name="net" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Carrior</th>
                <td><input type="text" class="inSTR90" id="carrien" name="carrien" readonly onFocus="blur();" value=""></td>
                <th class="thST2">Gross-Weight</th>
                <td>
                    <input type="text" class="inSTR90" id="gross" name="gross" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Carton</th>
                <td width="290px"><input type="text" class="inSTR90" id="carton" readonly onFocus="blur();" name="carton" value=""></td>
                <th class="thST2">Cubic-M</th>
                <td>
                    <input type="text" class="inSTR90" readonly onFocus="blur();" id="cubic" name="cubic" value=""/>
                </td>
            </tr>
            <tr>
                <th>Arrival Date</th>
                <td width="290px">
                    <input type="text" class="inSTR90" id="arrDate" name="arrDate" readonly onFocus="blur();" value=""/>
                </td>
                <th>Customs Clearance Date</th>
                <td width="290px">
                    <input type="text" class="inSTR90" id="clearDate" name="clearDate" readonly onFocus="blur();" value=""/>
                </td>
            </tr>
            <tr>
                <th>Import Declaration No.</th>
                <td width="290px">
                    <input type="text" class="inSTR90" id="importNo" name="importNo" maxlength="20" value=""/>
                </td>
                <th>Local Delivery Date</th>
                <td width="290px">
                    <input type="text" class="inST80" id="localDate" maxlength="10" name="localDate" value=""/>
                </td>
            </tr>
            <tr>
                <th>Vehicle NO</th>
                <td width="290px">
                    <input type="text" class="inST90" id="vehicleNo" name="vehicleNo" maxlength="20" value=""/>
                </td>
                <th>Local B/L<br>transportation No</th>
                <td width="290px">
                    <input type="text" class="inST90" id="transNo" name="transNo" maxlength="20" value=""/>
                </td>
            </tr>
            <tr>
                <th>Temperature</th>
                <td width="290px">
                    <input type="text" class="inST90" id="tempWh" name="tempWh" maxlength="20" value=""/>
                </td>
                <th></th>
                    <td width="290px">
                </td>
            </tr>
        </table>
        <br />
        <div class="taHeadW">
            <table class="TableST2Head" >
                <tr>
                    <th width="5%">No</th>
                    <th width="10%">Batch</th>
                    <th width="7%">Code</th>
                    <th width="33%">Description</th>
                    <!-- <th width="10%">Receiver</th> -->
                    <th width="10%">Quantity</th>
                    <th width="10%">Unit</th>
<!--                     <th width="%">Temperature</th> -->
                    <!-- <th width="5%">U</th> -->
                </tr>
            </table>
        </div>
        <div class="taBodyW">
            <table class="TableST2Body" id="movementDetailTable">
            </table>
        </div>    
        <br />
        <table class="TableST3">
            <tr>
                <th width="20%">Remarks</th>
                <td><textarea class="teST80" style="background:#eeeeee;" wrap="virtual" id="remark" name="remark" readonly onFocus="blur();" ></textarea></td>
            </tr>
        </table>
    </div>
    <div class="bo_btn" id="bo_btn" style="display: block;">
        <span id="confirmBtn"><ul class="btnst"><li class="a"><a href="#" id="confirmBtn" >CONFIRM</a></li></ul></span>
        <ul class="btnst"><li class="a"><a href="#" id="reSetBtn" >INIT</a></li></ul>
        <ul class="btnst"><li class="a"><a href="#" id="searchBtn" >SEARCH</a></li></ul>
        <ul class="btnst"><li class="a"><a href="#" id="saveBtn" >SAVE</a></li></ul>
        <span id="delBtn"><ul class="btnst"><li class="a"><a href="#" id="deleteBtn" >DELETE</a></li></ul></span>
    </div>
    <input type="hidden" name="roleId" id="roleId" value="${requestScope.roleId}">
    </form>
</div>
</body>
</html>